
//退出
 function onLogout(){
     $.ajax({
         trpe:'get',
         url:'http://api.yuguoxy.com/api/logout',
         success:function(result){
            if (result.resultCode == 1) {
                alert('是否退出账号')
                window.location = location
                $('.heade').css('opacity','0')
            }
         }
     })
 }
 $('.logout').on('click',function(){
     localStorage.removeItem('USER')
    //  window.location = location

    onLogout()
 })

/*
 * 获取轮播数据
 * */
function getBanner() {
    $.ajax({
        type: 'get',
        url: 'http://api.yuguoxy.com/api/shop/banner',
        success: function (result) {
            if (result.resultCode == 1) {
                let list = result.resultInfo.list 
                 lodaBanner(list)               
            }
        }
    })
}
//渲染轮播
function lodaBanner(bannerlist) {
    let arr = ''
    bannerlist.forEach(function (item) {
        let str = `
           <div class="swiper-slide"> <img src="${item.url}" alt=""> </div>              
                   `
        arr += str
       
    })
    $('.swiper-wrapper').html(arr)

}
//getBanner()

/**
 * 获取商品列表数据
 */
let totalNo = 0 //总页数
let productListStr = '' //所有商品列表字符
function getProductList(pageNo) {
    $.ajax({
        url: 'http://api.yuguoxy.com/api/shop/list',
        type: 'get',
        data: {
            pageNo,
            pageSize: 8
        },
        success: function (data) {
            if (data.resultCode == 1) {
                let list = data.resultInfo.list
                totalNo = data.resultInfo.totalNum //总页数
                loadProductList(list)
            }
        }
    })
}
/**
 * 动态渲染商品列表
 * @param {}} productList 
 */
function loadProductList(productList) {
    let arr = productList.map(item => {
        return `<div class="item" data-index="${item.id}">
                    <img src="${item.picture}" alt="">
                    <p>${item.product}</p>
                    <p class="price">￥<span>${item.price}</span></p>
                </div>`
    })
    let str = arr.join('')

    productListStr = productListStr + str
    $('.container').html(productListStr)
    
}

/**
 * 加载更多
 *   页号，动态变化
 *   拼接
 */
function onMore() {
    let pageNo = 1
    $('.more').on('click', function () {
        if (++pageNo > totalNo) {
            pageNo = totalNo
            return
        }
        getProductList(pageNo)
    })
}

/**
 * 商品详情事件
 */
function onProductDetail() {
    $('.container').on('click', '.item', function () {
        let id = $(this).attr('data-index')
        location.href = '../pages/productDetail.html?id=' + id
    })
}

/*
 * 跳转到购物车界面
 */
function onCart() {
    $('.cart').on('click', function () {
        if(xian2){
            location.href='./cart.js'
            window.location = location
        }
        else{
            alert('请先注册或登录')
            return
            // location.href = './productlist.html'
        }
        location.href = '../pages/cart.html'
    })
}

/*
 * 回到顶部按钮
 */
$('.back').on('click', function () {
    var scrollTop = document.documentElement.scrollTop
    var h = setInterval(function () {
        document.documentElement.scrollTop = scrollTop - 20
        scrollTop = document.documentElement.scrollTop

        if (scrollTop <= 0) {
            clearInterval(h)
        }
    }, 20)
})


//登录界面
/**
  * 用户非空验证
  */
 function checkUserNameLogin() {
    if ($('.login-username').val() == '') {
        $('.usn').html('用户名不能为空!')
        return false
    } else {
        $('.usn').html('')
        return true
    }
}
/**
 * 密码非验证
 */
function checkPasswordLogin() {
    //密码非空验证
    if ($('.login-password').val() == '') {
        $('.psw').html('密码不能为空!')
        return false
    } else {
        $('.psw').html('')
        return true
    }
}

//注册界面验证
//登录界面
/**
  * 用户非空验证
  */
 function checkUserName() {
    if ($('.sign-username').val() == '') {
        $('.usn').html('用户名不能为空!')
        return false
    } else {
        $('.usn').html('')
        return true
    }
}
/**
 * 密码非验证
 */
function checkPassword() {
    //密码非空验证
    if ($('.sign-password').val() == '') {
        $('.psw').html('密码不能为空!')
        return false
    } else {
        $('.psw').html('')
        return true
    }
}

/*
 * 头像非空验证
 */
function checkHeading() {
    if ($('.sign-heading').val() == '') {
        $('.head').html('头像不能为空!')
        return false
    } else {
        $('.head').html('')
        return true
    }
}



/**
 * 调用注册接口
 */
function onSign() {
    //调用注册接口
    $.ajax({
        type: 'POST',
        url: 'http://api.yuguoxy.com/api/sign',
        data: {
            username: $('.sign-username').val(),
            password: $('.sign-password').val(),
            nick: $('.name').val(),
            createtime: $('.time').val(),
            headerimg: $('.sign-heading').val()
        },
        success: function (result) {
            if (result.resultCode == 1) {
                
               alert('注册成功')
               window.location = location

               $('.sign').css('display','none')
               $('.login').css({'display':'block'})
                toMain() //跳转主界面 
            } else {
                alert(result.resultInfo)
            }
        },
    })
}
$('#confirm').on('click', function () {
    onSign()
 })

/**
 * 调用登录接口，账号验证
 */
$('#login-confirm').on('click',function(e){
    e.preventDefault()
    onLogin()
})


//显示用户信息
function showUser(showlist) {
    //获取数据
        let str =`
            <img src="${showlist.headerimg}" alt="">
             <span>${showlist.nick}</span>
        `    
      $('.heade').html(str)
} 

 //调用登录接口

 function onLogin() {
    $.ajax({
        type: 'POST',
        url: 'http://api.yuguoxy.com/api/login',
        data: {
            username: $('.login-username').val(),
            password: $('.login-password').val()
        },
        success: function (result) {
        
            if (result.resultCode == 1) {              
                alert('登录成功')                    
                let list = result.resultInfo
                localStorage.setItem('USER', JSON.stringify(list))
                showUser(list)    
                $('.login').css('display','none')      
       // location.href = '../pages/prodcuctlist.html'
            }  else {
                alert(result.resultInfo)
            }         
        }
    }) 
} 

//登录之后显示的用户头像和昵称
let xian1 = localStorage.getItem('USER')
let xian2 = JSON.parse(xian1)
function xian(){
    if(xian2){
        let str =`
        <img src="${xian2.headerimg}" alt="">
         <span>${xian2.nick}</span>
        `    
      $('.heade').html(str)
    }else{
        $('.heade').html('')
    }}
xian()

//点击登录，显示登录表单
$('.login1').on('click',function(){
    $('.sign').css('display','none')
    $('.login').css('display','none')

    $('.login').css({'display':'block'}) 
})

//点击注册，显示注册表单
$('.sign1').on('click',function(){
    $('.sign').css('display','none')
    $('.login').css('display','none')

    $('.sign').css({'display':'block'}) 
})

//失去焦点
//登录界面失去焦点
$('.login-username').on('blur', function () {
    checkUserNameLogin()
})
$('.login-password').on('blur', function () {
    checkPasswordLogin()
})

//注册界面失去焦点
$('.sign-username').on('blur', function () {
    checkUserName()
})
$('.sign-password').on('blur', function () {
    checkPassword()
})
$('.sign-heading').on('blur', function () {
    checkHeading()
})

//导航事件
$('.out').on('click',function(){
    location.href ='../pages/takeOut.html'
})

//选择导航显示样式
$('ol>li').click(function () {
    $(this).addClass('active').siblings().removeClass('active')
})

//绑定登录 注册 界面上的X按钮
$('form>span').on('click',function(){
    $('.sign').css('display','none')
    $('.login').css('display','none')
})

getProductList(1)
onMore()
onProductDetail()
//getBanner()
onCart()
